<template>
	<view class="page_main page_render" :class="{ can_show: page_render }">
		<pagelogin ref="pagelogin" @loginready="pagerefresh" @initcallback="com_pagelogin_initcallback($event)" :need_login="0">
			<!-- hasHeight :navstyle="{ background: '#1F1F1F' }" -->
			<diynav ref="diynav" :navstyle="{ background: '#383950' }" isFixed back hasHeight :title="page_title" @settop="set_pagetop($event)"></diynav>

			<view class="article_view" :style="{ padding: padding_judge_safe([30]) }" v-if="render_req">
				<view class="article">
					<rich-text :nodes="page_data"></rich-text>
					<myVideoList width="690" radius="0" margin="0" :urls="video_scr"></myVideoList>
					<myImgList width="690" radius="10" mode="widthFix" margin="0" number="1" :urls="img_scr" @imgClick="com_previewImage($event)"></myImgList>
				</view>
			</view>
		</pagelogin>
	</view>
</template>

<script>
import pagelogin from '@/components/pagelogin/pagelogin';

import storeMixin from '@/store/storeMixin';
export default {
	mixins: [storeMixin],
	components: {
		pagelogin,
	},
	data() {
		return {
			color_mode: 'day',
			change_var: {},
			scrollTop: 0,
			render_component_init: false,
			page_render: false,
			page_title: '',
			render_req: false,
			nextreq: true,
			carinfo: {},
			page_id: 0,
			page_type: 'config_type', // config_type 系统配置  help_list 帮助中心
			page_form: {},
			page_data: {},
			page_list: [],
			loadingstatus: 0,

			video_scr: '',
			img_scr: '',
		};
	},
	onShow() {},
	onLoad(v) {
		let _this = this;
		_this.page_type = v.type || 'config_type';
		_this.page_id = v.id;

		_this.init_pagedata();
	},
	onShow() {
		this.com_onshow_fun();
	},
	onHide() {
		this.com_page_hide(this);
	},
	onPageScroll(e) {
		this.scrollTop = e.scrollTop;
	},
	onPullDownRefresh() {
		this.pagerefresh(1);
	},
	methods: {
		pagerefresh(type) {
			let _this = this;
			_this.startPulldownJudge(type);
			_this.com_page_show(_this);
			_this.com_loading_fun();
			_this.init_page();
		},
		init_page() {
			let _this = this;
			let url = _this.back_type_data('url');
			let data = _this.back_type_data('req_data');
			let data_handle_on = _this.back_type_data('data_handle_on');
			let method = _this.back_type_data('method');

			_this.com_getdata({
				url,
				data,
				data_handle_on,
				method,
				data_fun: function (v) {
					if (v.state == 1) {
						let { page_title, page_data, IMAGE, VIDEO } = _this.back_type_data('res_data', v);
						_this.page_title = page_title;
						_this.page_data = page_data;
						_this.video_scr = VIDEO;
						_this.img_scr = IMAGE;
						_this.$nextTick(() => {
							_this.com_loading_fun({ mode: 0 });
						});
					}
				},
			});
		},
		back_type_data(type, res = false) {
			let _this = this;
			let url = '';
			let req_data = {};
			let data_handle_on = true;
			let method = 'POST';
			let res_data = {};
			let res_key = '';
			let res_key_obj = '';
			switch (_this.page_type) {
				case 'config_type':
					url = '/base/config';
					req_data['config_key'] = _this.page_id;
					data_handle_on = true;
					if (res) {
						res_data['page_title'] = res.info.config_remark;
						// res_data['page_data'] = res.info.config_value;
						res_key_obj = 'info';
						res_key = 'config_value';
					}
					break;
				case 'help_list':
					url = '/help/info';
					req_data['id'] = _this.page_id;
					data_handle_on = false;
					method = 'GET';
					if (res) {
						res_data['page_title'] = res.data.help_title;
						// res_data['page_data'] = res.data.help_content;
						res_key_obj = 'data';
						res_key = 'help_content';
					}
					break;
			}
			if (res_key) {
				let { IMAGE, VIDEO, RICH_TEXT } = _this.mateVideoImage(res[res_key_obj][res_key]);

				res_data['page_data'] = RICH_TEXT;
				res_data['IMAGE'] = IMAGE;
				res_data['VIDEO'] = VIDEO;
			}

			if (type == 'url') {
				return url;
			}
			if (type == 'req_data') {
				return req_data;
			}
			if (type == 'data_handle_on') {
				return data_handle_on;
			}
			if (type == 'method') {
				return method;
			}
			if (type == 'res_data') {
				return res_data;
			}
		},
	},
	watch: {},
};
</script>

<style lang="scss">
.article_view {
	padding: 30rpx;

	.article {
		// padding: 20rpx;
		// background-
		color: #fff;
		border-radius: 20rpx;
	}
}
</style>
